<!DOCTYPE html>
<html>
	<head>
		<title>Monster Mash</title>
		<link href="styles/my_style.css" rel="stylesheet">
	</head>
	<body>
		<header id="top">
			<img src="images/Monster_Mashup.png" />
			<button id="btnRandom">Randomize</button>
			<button id="btnReset">Reset</button>
			<p>Make your own monster face by clicking on the picture.</p>
		</header>
		<div id="container">
			<img class="lightning" id="lightning1" src='images/lightning-01.jpg' />
			<img class="lightning" id="lightning2" src='images/lightning-02.jpg' />
			<img class="lightning" id="lightning3" src='images/lightning-03.jpg' />
			<div id="frame">
				<div id="pic_box">
					<div id="head" class="face"><img src="images/headsstrip.jpg"></div>
					<div id="eyes" class="face"><img src="images/eyesstrip.jpg"></div>
					<div id="nose" class="face"><img src="images/nosesstrip.jpg"></div>
					<div id="mouth" class="face"><img src="images/mouthsstrip.jpg"></div>
				</div>
			</div>
		</div>
		<script type="text/javascript" src="scripts/jquery-1.6.2.min.js"></script>
		<script type="text/javascript" src="scripts/my_scripts.js"></script>
	</body>
</html>